<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<title>数据字典管理</title>
	<link rel="stylesheet" href="../../js/bower_components/bootstrap/dist/css/bootstrap.min.css">
	<link rel="stylesheet" href="../../js/bower_components/bootstrap-select/dist/css/bootstrap-select.min.css">
	<link rel="stylesheet"
		href="../../js/bower_components/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.min.css">
	<link rel="stylesheet" href="../../js/bower_components/bootstrap-table/dist/bootstrap-table.min.css">
	<link rel="stylesheet" href="../../js/bower_components/bootstrap-treeview/dist/bootstrap-treeview.min.css">

	<script src="../../js/bower_components/jquery/dist/jquery.min.js"></script>

	<script src="../../js/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
	<script src="../../js/bower_components/bootbox.min.js"></script>
	<script src="../../js/bower_components/bootstrap-select/js/bootstrap-select.js"></script>
	<script src="../../js/bower_components/bootstrap-switch/dist/js/bootstrap-switch.min.js"></script>
	<script src="../../js/bower_components/bootstrap-table/dist/bootstrap-table.min.js"></script>
	<script src="../../js/bower_components/bootstrap-table/dist/locale/bootstrap-table-zh-CN.js"></script>

	<script src="../../js/bower_components/bootstrap-treeview/dist/bootstrap-treeview.min.js"></script>
	<script src="../../js/bower_components/jquery-form-validator/form-validator/jquery.form-validator.min.js"></script>
	<script src="../../js/bower_components/moment/min/moment-with-locales.min.js"></script>
	 <script>
        $(function () {
            initRole();
            inittable();
            initDeptForm();

            $("#btnAdd").click(function(){
                console.log("模态框打开方法===1");
                $('#divForm').modal();
                console.log("模态框打开方法===2");
			});
        });

        //表格属性
        function initRole() {
            $("#selDept").empty;
            $.ajax({
                type: "get",
                url: "http://121.37.241.58:8883/logic/baseInfo/employee/deptList",
                dataType: "json",
                success: function (res) {
                    console.log(res);
                    if(!res.flag){
                        $.each(res,function(i,n){
                            $("#selDept").append("<option value=\""+n.dept+"\">"+n.dept+"</option>")
                        });
                        $("#selDept").append("<option value='全部'>全部</option>");
						$("#selDept").selectpicker('refresh');
                    }
                }
            })
        }

        //表单当中的所属权限
			function initDeptForm(){
				$("#selDeptForm").empty;
				$.ajax({
					type: "get",
					url: "http://121.37.241.58:8883/logic/baseInfo/employee/deptList",
					dataType: "json",
					success:function(res){
						console.log(res);
						if(!res.flag){
							$.each(res,function(i,n){
								$("#selDeptForm").append("<option value=\""+n.dept+"\">"+n.dept+"</option>")
							});
							$("#selDeptForm").selectpicker('refresh');
						}
					}
				})
			}


        function inittable(){
            $("#tblResult").bootstrapTable("destroy");
            $("#tblResult").bootstrapTable({
                loadMsg: "正在加载数据....",
                url: "http://121.37.241.58:8883/logic/baseInfo/employee/find",
                sidePagination: 'client',
                pageSize: "5",
                Pageinatin: true,
                idField: "id",
                columns:[{field: "empno",
                    title: "员工编号",
                    halign: 'center'
                },{field: "namecn",
                    title: "员工姓名",
                    halign: 'center'
                },{field: "dept",
                    title: "所在部门",
                    halign: 'center'
                },{field: "id",
                    title: "上级ID",
                    halign: 'center'
                }]
            })
        }
    </script>
 </head>
<body>
    <!-- 查询区域 -->
    <div class="container-fluid">
        <div class="row col-md-10">
            <div id="SearchForm" class="form-inline">
                <div class="input-group">
                    <label for="tbxNamecn" class="control-label">姓名</label>&nbsp;&nbsp;
                    <input type="text"  id="tbxNamecn">
                </div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <div class="input-group">
                    <label class="control-label" for="selDept">部门列表</label>&nbsp;&nbsp;
                    <select id="selDept"></select>
                </div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <div class="form-group">
                    <button type="button" id="btnSearch" class="btn btn-primary">搜索</button>
                </div>
            </div>
        </div>
        <!-- 功能区域 -->
        <div style="margin-top: 5px;" class="form-inline">
            <div id="btnTools">
                <button type="button" id="btnAdd" class="btn btn-success">新增</button>
                <button type="button" id="btnDel" class="btn btn-danger">删除</button>
				<button type="button" id="btnUpdate" class="btn btn-warning">修改</button>
            </div>
        </div>
        <br>
        <!-- 列表区域 -->
        <div class="row col-md-10">
            <table id="tblResult"></table>
        </div>
    </div>
    <!-- 模态框的使用 -->
		<div class="modal fade" id="divForm" tabindex="-1" role="dialog" aria-labelledby="myModal" aria-hidden="false">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
						<h4 class="modal-title" id="modalTitle">用户信息</h4>
					</div>

					<div class="modal-body form-inline">
						<div class="form-group">
							<label class="control-label" for="empno">员工编号</label>
							<input type="text" id="empno" style="width: 220px;" class="form-control" />
						</div>
                        <br>
						<div class="form-group">
							<label class="control-label" for="namecn">员工姓名</label>
							<input type="text" id="namecn" style="width: 220px;" class="form-control" />
						</div>
                        <br>
                        <div class="form-group">
							<label class="control-label" for="id">上级&nbsp;&nbsp;&nbsp;ID</label>
							<input type="text" id="id" style="width: 220px;" class="form-control" />
						</div>
                        <br>
						<div class="form-group">
							<label class="control-label" for="selDeptForm">所属部门</label>
							<select id="selDeptForm"></select>
						</div>
                        <br>
						<div class="modal-footer">
							<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
							<button type="button" class="btn btn-primary">保存</button>
						</div>
					</div>
				</div>
			</div>
		</div>
</body>
</html>